entry {
    ui::interact-with-window {
        title: { const 'Mouse Event Demo' },
        content: Root,
        assets: [StyleSheet],
        on-close: { Some { sys::exit 0 } }
    }
};
asset StyleSheet: AssetCSS 'assets/style.css';

// TODO: mouse enter => Some pos, mouse out => None
const MousePosition: ui::Hook[Source[(NormalFloat,NormalFloat)]]
    &(k) =>
        \ do let pos := { Bus::[(NormalFloat,NormalFloat)] () },
        let cpt := { k pos.out },
        (cpt with { ui::Event ('mousemove.rect',
            \ ui::extract-float let x := 'webuiCurrentTargetX',
            \ ui::extract-float let y := 'webuiCurrentTargetY',
            { ui::EventCallback (pos.in <- (x, y)) }
        )});

const Root: ui::Component
    \ use let pos := MousePosition,
    { { ui::Box ['box'] } [
        { ui::Text
            pos
            . { map &(x,y) => { "x=?, y=?" (x.{String}, y.{String}) } }
            . { Computed { beginning: [''] } }
        }
    ] };
